@import './mixins';
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,a,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
box-sizing: border-box;
}
i { font-style: normal; }
body {
  font-size: .16rem;
  margin: 0;
  padding: 0;
  font-family: sans-serif;
  -webkit-user-select: none;
  user-select: none;
}
li {list-style: none;}

/* 常用样式 */
.z-index-2 {z-index: 2;}
.z-index-3 {z-index: 3;}
.h100pc { height: 100%; }
.w100pc { width: 100%; }
.bold400 { font-weight: 400; }
.dsn {display: none;}
.rel { position: relative; }
.abs { position: absolute; }
.fixed { position: fixed; }
.circle { border-radius: 50%; }

/*背景颜色*/
.bg-black { background: #282828; }
.bg-gray { background: #EBEBEB; }
.bg-fff { background: #FFFFFF;}
.bg-orange { background: #e3c79f;}
.bg-orange2x { background: #f85;}


/*字体颜色*/
.cfff { color: #fff; }
.c666 { color: #666; }
.c999 { color: #999; }
.orange { color: #fc7103; }
.orange2x { color: #f44; }
.blue { color: #7bafe1; }
.pink { color: #faa0b5; }
.green { color: #bbcea5; }
.cyan { color: #80dae6; } // 青色

// 字体设置
.f8 { font-size:0.8rem; }
.f10 { font-size: 0.10rem; }
.f12 { font-size: 0.12rem; }
.f14 { font-size: 0.14rem; }
.f16 { font-size: 0.16rem; }
.f18 { font-size: 0.18rem; }
.f20 { font-size: 0.20rem; }
// margin
.mg-top-10 { margin-top: .1rem; }
.mg-top-15 { margin-top: 0.15rem; }
.mg-top-20 { margin-top: 0.20rem; }
.mg-top-30 { margin-top: 0.30rem; }

.mg-left-10 { margin-left: .1rem;}
.mg-left-15 { margin-left: .15rem;}
.mg-left-20 { margin-left: .2rem;}
// 左右
.padd-16 { padding: 0 0.16rem; }
.padd-left-16 { padding-left: 0.16rem; }

/* flex布局 */
.flex { display: flex; }
.jc-start { justify-content: flex-start; }
.jc-center { justify-content: center; }
.jc-end { justify-content: flex-end; }
.jc-sa { justify-content: space-around; }
.jc-sb { justify-content: space-between; }
.fdc {
  display: flex;
  flex-direction: column;
}
.flex .fg1 { flex-grow: 1; }
.flex .fg2 { flex-grow: 2; }
.flex .fg3 { flex-grow: 3; }
.aic { align-items: center; }
.fsb,
.fsa,
.fcc {
  display: flex;
  align-items: center;
}
.fcc { justify-content: center; }
.fsb { justify-content: space-between; }
.fsa { justify-content: space-around; }
.ifcc {
  display: inline-flex;
  justify-content: center;
  align-items: center;
}

#root {
  height: 100%;
}
#root > div {
  height: 100%;
}